<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<!--
			创建节点
			
			createElement("标签的名称") 	创建一个元素节点
			createTextNode("文本内容") 	创建文本节点
			setAttribute("属性名称","属性的值")	设置属性
			
			父级元素.appendChild("创建的节点")	将创建的节点插入到父级节点的末尾
			父级元素.insertBefore("创建的节点", "指定的节点位置") 将创建的节点插入到指定节点的前面
		-->
		<script type="text/javascript">
			//需求：1、添加一个a标签，href属性为http://www.itsource.cn，内容为”源码时代教育”，添加到网页的body中；
			//创建节点五部曲
			
			//1.创建元素节点
			var a=document.createElement("a");
			
			//2.创建文本节点
			var aText=document.createTextNode("源码时代教育");
			
			//3.设置属性
			a.setAttribute("href","http://www.itsource.cn");
			
			//4.将文本内容添加到标签中
			a.appendChild(aText);
			
			//5.将制作好了的a标签添加到body中
			document.body.appendChild(a);
		</script>
		
		<select id="city">
			<option value="sh">上海</option>
			<option value="nc">nanchong</option>
			<option value="bj">北京</option>
		</select>
		
		<script type="text/javascript">
			//需求：在南充前面加一个成都的选项
			
			//1.获取对象
			var city=document.getElementById("city");
			var ops=city.options;
			
			//2.创建一个option标签
			var op=document.createElement("option");
			
			//3.创建option里面的文本内容
			var opText=document.createTextNode("成都");
			
			//4.设置option的属性
			op.setAttribute("value","cd");
			op.selected="selected";//不在代码中显示
			
			//5.将文本内容添加到option里面
			op.appendChild(opText);
			
			//6.将新创建的option添加到南充的前面
			city.insertBefore(op,ops[1]);
		</script>
	</body>
</html>
